<!-- 复制133 -137行代码 -->
<!-- 修改js代码 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=2.0, user-scalable=no"/>
<meta name="HandheldFriendly"content="true"/>
<meta http-equiv="x-rim-auto-match" content="none"/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no">
<title>支付房租表单</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="style/css/global.css" rel="stylesheet">
<link href="style/css/common.css" rel="stylesheet">
<script type="text/javascript" src="style/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="style/js/zepto.min.js"></script>
<script type="text/javascript" src="style/js/common.js"></script>
<script type="text/javascript">
$(function(){
	//获得文本框对象
	var t = $("#text_box");	
	//数量增加操作
	$("#add").click(function(){		
		t.val(parseInt(t.val())+1)
		if (parseInt(t.val())!=1){
			$('#min').attr('disabled',false);
		}
		setTotal();
	})	
	//数量减少操作
	$("#min").click(function(){
		t.val(parseInt(t.val())-1);
		if (parseInt(t.val())==1){
			$('#min').attr('disabled',true);
		}
		setTotal();
	})
	//计算操作
	// 正则匹配
	var reg =/^\d+/;
	var price =parseInt($('#price').text());
	var price1 , price2 ,price3 , price4 ,price5 ;
	var water =$('#water'),poof =$('#poof'), oil =$('#oil'), net =$('#net'),tv =$('#tv');
	var totalPrice, raiseMoney;
	function setTotal(){
		$("#total").html((parseInt(t.val())*price));
		var total =parseInt($("#total").text());
		price1 =water.val() ==''? 0 :reg.test(water.val()) ==false ?0:parseInt(water.val());
		price2 =poof.val() ==''? 0 :reg.test(poof.val()) ==false ?0:parseInt(poof.val());
		price3 =oil.val() ==''? 0 :reg.test(oil.val()) ==false ?0:parseInt(oil.val());
		price4 =net.val() ==''? 0 :reg.test(net.val()) ==false ?0:parseInt(net.val());
		price5 =tv.val() ==''? 0 :reg.test(tv.val()) ==false ?0:parseInt(tv.val());
		totalPrice =price1+price2+price3+price4+price5+total;
		raiseMoney =(totalPrice*0.01).toFixed(2);
		$('#t').text(totalPrice+'+'+raiseMoney+'('+'手续费'+')');
	}
	$('.intxt').on('input',function(){
		setTotal();
	})
	//初始化
	setTotal();
})
</script>
</script>
</head>

<body>
<div class="wrap">
	<!--头部-->
	<div class="header w_screen">
		<h1 class="title">支付房租表单</h1>
		<a href="javascript:history.go(-1);" class="btn_left"><span class="ico_back"></span></a>
	</div>

	<!--主体-->
	<div class ='calculator'>
		<p class ='calculator_title'>房租：</p>
		<div class="calculator_bo">
			<table>
				<tr>
					<td class='td_left'></td>
					<td>
						<span class ='set_color font_size money'>￥</span>
						<span class ='set_color font_size' id ='price'>1450</span>
						<span class ='set_color font_size multy'>×</span>
						<input class ='font_size' id="min" name="" type="button" value="-" />
						<input class ='set_color font_size' id="text_box" name="" type="text" value="1" disabled='disabled' />
						<input class ='font_size' id="add" name="" type="button" value="+" />
						<span class ='font_size'>月</span>
					</td>
				</tr>
				<tr>
					<td class='td_left'>
						<div class ='calculator_total'>
							共计：
						</div>
					</td>
					<td>
						<span class ='set_color font_size'>￥</span><span class ='set_color font_size' id ='total'>2340</span>
					</td>
				</tr>
			</table>
			
		</div>
		
		
	</div>
	<div class="main pad_header reset">
		<div class="form_pay">
			<div class="item_box">
				<div class="item">
					<div class="lab">押金</div>
					<div class="inbox"><input id ='water' class="intxt" type="tel" value="" placeholder=""></div>
					<div class="unit">元</div>
				</div>
				<div class="item">
					<div class="lab">水电煤</div>
					<div class="inbox"><input id ='oil' class="intxt" type="tel" value="" placeholder=""></div>
					<div class="unit">元</div>
				</div>
				<div class="item">
					<div class="lab">物业费</div>
					<div class="inbox"><input id ='poof' class="intxt" type="tel" value="" placeholder=""></div>
					<div class="unit">元</div>
				</div>
				<div class="item">
					<div class="lab">宽带费</div>
					<div class="inbox"><input id ='net' class="intxt" type="tel" value="" placeholder=""></div>
					<div class="unit">元</div>
				</div>
				<div class="item">
					<div class="lab">电视费</div>
					<div class="inbox"><input id ='tv' class="intxt" type="tel" value="" placeholder=""></div>
					<div class="unit">元</div>
				</div>
			</div>
			
			<div class="item_box item_box_reset">
				<div class="item">
					<div class="lab">到账时间</div>
					<div class="inbox inbox_reset">普通到账</div>
				</div>
			</div>
		</div>
		<div class="fix_bot w_screen">
			<div class="txt" style ='background:#D94B5B'>应付金额：<span id ='t'>3400</span></div>
			<a class="btn" href="#" style ='background:#EC6876'>确认支付</a>
		</div>
	</div>
</div>

<div class="wrap_bg bg_grey w_screen"></div>
</body>
</html>